<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 1.理解：
        * 就是一块“地盘”，一个代码段所在的区域
        * 它是静态的（相对于上下文对象），在编写代码时就确定的
     2.分类
        * 全局作用域
        * 函数作用域
        * 没有作用域（es6有了）
     3. 作用
        * 隔离变量，不同作用域下同名变量不会有冲突 -->
    <script>
        // 没有块作用域
        // if (true) {
        //     var c = 3;
        // }
        // console.log(c);

        var a = 10;
        b = 20;

        function fn(x) {
            var a = 100
            c = 300
            console.log('fn()', a, b, c, x);

            function bar(x) {
                var a = 10000
                d = 400
                console.log('bar()');
            }
        }
    </script>

</body>

</html>